import { lazy } from "react";
import { createBrowserRouter } from 'react-router-dom'
import {
    MenuFoldOutlined,
    UploadOutlined,
    UserOutlined,
    VideoCameraOutlined,
} from '@ant-design/icons';

const App = lazy(() => import('../App'))
const Home = lazy(() => import('../pages/home/Index'))
const Wen = lazy(() => import('../pages/wen/Index'))
const Xitong = lazy(() => import('../pages/xitong/Index'))
const Error = lazy(() => import('../pages/error/Index'))
const Alova = lazy(() => import('../pages/alova/Index'))
const Chajian = lazy(() => import('../pages/chajian/Index'))
const Pro = lazy(() => import('../pages/Pro/Index'))
const Duoji = lazy(() => import('../pages/duoji/Index'))
const Guanli = lazy(() => import('../pages/guanli/Index'))
const About = lazy(() => import('../pages/about/Index'))

// 三级
const W1 = lazy(() => import('../pages/wen/w1/Index'))
const X1 = lazy(() => import('../pages/xitong/x1/Index'))
const E1 = lazy(() => import('../pages/error/e1/Index'))
const A1 = lazy(() => import('../pages/alova/a1/Index'))
const C1 = lazy(() => import('../pages/chajian/c1/Index'))
const P1 = lazy(() => import('../pages/Pro/p1/Index'))
const D1 = lazy(() => import('../pages/duoji/d1/Index'))
const G1 = lazy(() => import('../pages/guanli/g1/Index'))
const G2 = lazy(() => import('../pages/guanli/g2/Index'))
const G3 = lazy(() => import('../pages/guanli/g3/Index'))

type homeRouter = {
    path: string;
    element: JSX.Element;
    children?: homeRouter;
    icon?: any;
    label?: string;
}[]

export const homeRoutes: homeRouter = [
    {
        path: '/home',
        element: <Home></Home>,
        icon: <MenuFoldOutlined />,
        label: '首页'
    },
    {
        path: '/wen',
        element: <Wen></Wen>,
        icon: <UploadOutlined />,
        label: '文档',
        children: [
            {
                path: '/wen/w1',
                element: <W1></W1>,
                icon: <UploadOutlined />,
                label: '文档111',
            }
        ]
    },
    {
        path: '/xitong',
        element: <Xitong></Xitong>,
        icon: <UserOutlined />,
        label: '系统功能',
        children: [
            {
                path: '/xitong/x1',
                element: <X1></X1>,
                icon: <UserOutlined />,
                label: '系统功能111',
            }
        ]
    },
    {
        path: '/error',
        element: <Error></Error>,
        icon: <MenuFoldOutlined />,
        label: '异常页',
        children: [
            {
                path: '/error/e1',
                element: <E1></E1>,
                icon: <MenuFoldOutlined />,
                label: '异常页111',
            }
        ]
    },
    {
        path: '/alova',
        element: <Alova></Alova>,
        icon: <VideoCameraOutlined />,
        label: 'alova示例',
        children: [
            {
                path: '/alova/a1',
                element: <A1></A1>,
                icon: <VideoCameraOutlined />,
                label: 'alova示例111',
            }
        ]
    },
    {
        path: '/chajian',
        element: <Chajian></Chajian>,
        icon: <UploadOutlined />,
        label: '插件示例',
        children: [
            {
                path: '/chajian/c1',
                element: <C1></C1>,
                icon: <UploadOutlined />,
                label: '插件示例111',
            }
        ]
    },
    {
        path: '/pro',
        element: <Pro></Pro>,
        icon: <VideoCameraOutlined />,
        label: 'Pro Naive UI 示例',
        children: [
            {
                path: '/pro/p1',
                element: <P1></P1>,
                icon: <VideoCameraOutlined />,
                label: 'Pro Naive UI 示例11',
            }
        ]
    },
    {
        path: '/duoji',
        element: <Duoji></Duoji>,
        icon: <MenuFoldOutlined />,
        label: '多级菜单',
        children: [
            {
                path: '/duoji/d1',
                element: <D1></D1>,
                icon: <MenuFoldOutlined />,
                label: '多级菜单',
            }
        ]
    },
    {
        path: '/guanli',
        element: <Guanli></Guanli>,
        icon: <VideoCameraOutlined />,
        label: '系统管理',
        children: [
            {
                path: '/guanli/g1',
                element: <G1></G1>,
                icon: <VideoCameraOutlined />,
                label: '用户管理',
            },
            {
                path: '/guanli/g2',
                element: <G2></G2>,
                icon: <VideoCameraOutlined />,
                label: '角色管理',
            },
            {
                path: '/guanli/g3',
                element: <G3></G3>,
                icon: <VideoCameraOutlined />,
                label: '菜单管理',
            },
        ]
    },
    {
        path: '/about',
        element: <About></About>,
        icon: <UploadOutlined />,
        label: '关于'
    },

]

const routes: homeRouter = [
    {
        path: '/',
        element: <App></App>,
        children: homeRoutes
    }
]
const router = createBrowserRouter(routes)

export default router